<template>
  <div>
    <h1>注册案例-操作其他表单元素</h1>
    <div>
      姓名： <input type="text" placeholder="请输入你的姓名" v-model="username">
    </div>
    <div>
      描述：<textarea  cols="30" rows="10" v-model="desc"></textarea>
    </div>
    <div>
      籍贯：
      <select v-model="city">
        <option value="1">北京</option>
        <option value="2">上海</option>
        <option value="3">广州</option>
        <option value="4">曹县</option>
      </select>
    </div>
    <div>
      性别：
      <!-- 单选框，多个单选框要使用同一个v-model -->
      <input v-model="gender" type="radio" value="1"> 男
      <input v-model="gender" type="radio" value="0"> 女
    </div>
    <div>
      爱好：
      <input v-model="hobby" type="checkbox" value="篮球"> 篮球
      <input v-model="hobby" type="checkbox" value="足球"> 足球
      <input v-model="hobby" type="checkbox" value="羽毛球"> 羽毛球
      <input v-model="hobby" type="checkbox" value="台球"> 台球
    </div>

    <div>
      是否单身：<input type="checkbox" v-model="isDog">
    </div>

    <button>注册</button>
  </div>
</template>

<script>
export default {
  data () {
    return {
      username: 'admin',
      desc: '',
      city: '4',
      gender: '1',
      hobby: ['足球', '台球'],
      isDog: true
    }
  }
}
</script>

<style>

</style>